<template>
	<div class="calendar">
		<div class="top">
			<b>{{post.header}}</b><span>更多<i class="iconfont">&#xe678;</i></span>
		</div>
		<div class="xiang">
			<img :src="post.thumb">
			<p>{{post.title}}</p>
			<p><img :src="post.author_avatar"><span>{{post.author_name}}</span><i>{{post.location}}</i></p>
		</div>
	</div>
</template>
<script>
	export default{
		props:['post']
	}
</script>
<style lang='stylus' scoped>
	.top{
		display: flex;
		width: 100%;
		justify-content: space-between;
		padding:.3rem .26rem 0 0;
		font-size: .45rem;
		border-top: .3rem solid #f5f5f5;
		padding-bottom: .26rem;
		b{
			padding-left: .6rem;
			border-left: .1rem solid #f4d101;
			color: #f4d101;
		}
		span{
			color: #7d7b7b;
			font-size: .35rem;
		}
	}
	.xiang{
		width: 100%;
		img{
			width: 100%;
		}
		p{
			font-size: .42rem;
			padding:.2rem;
			display: flex;
			align-items:center;
			>img{
				width: 8%;
				border-radius: 50%;
			}
			span{
				margin-left: .15rem;
    			color: #fdc522
			}
			i{
				font-style: normal;
				margin-left: .2rem;
			    color: #979797;
			}
		}
	}
</style>